body {
  padding: 300px;
}
body section:first-child {
  width: 400px;
  height: 200px;
  border: solid 1px gray;
  display: grid;
  grid-template-rows: repeat(2, 50%);
  grid-template-columns: 25% 25% 25% 25%;
}
body section:first-child div {
  background-color: hotpink;
  padding: 5px;
  background-clip: content-box;
  border: solid 1px gray;
}
body section:nth-child(2) {
  width: 200px;
  height: 200px;
  border: solid 1px gray;
  display: grid;
  grid-template-rows: 100%;
  grid-template-columns: repeat(4, 25%);
}
body section:nth-child(2) div {
  background-color: hotpink;
  padding: 5px;
  background-clip: content-box;
  border: solid 1px gray;
}
